// components/custom-checkbox/custom-checkbox.js
Component({

  /**
   * 组件的初始数据
   */
  data: {
    isChecked: false,
    name: 'tom'
  },

  // 组件生命周期声明对象
  lifetimes: {
    //created：组件实例被创建好以后执行
    created() {
      console.log('created')
      this.setData({
        name: 'jerry',
      })
    },

    //组件被初始化完毕，模板解析完成，已经把组件挂载到页面上
    attached() {
      console.log('attached')
    },

    //组件被销毁时
    detached() {
      console.log('detached')
    },
  },

  options: {
    // 使 组件内"设置样式的类选择器"设置的样式 生效
    styleIsolation: "shared"
  },

  /**
   * 组件的属性列表 组件的属性列表:维件的对外属性，主要用来接收组件使用者传递给组件内部的属性以及数据
   */
  properties: {
    //   lable:String //简写
    // type 组件使用者传递的数据类型,数据类型:string、Number、Boolean、0bject、Array,也可以设置为 nu11，表示不限制类型
    lable: {
      //
      type: String,
      value: ''
    },
    position: {
      type: String,
      value: 'right'
    },
    checked: {
      type: Boolean,
      value: false
    }

  },

  observers: {
    // 监听获取从组件使用者(ccc.js)传递的checked的值  赋值给当前组件
    checked: function (newChecked) {
      this.setData({
        isChecked: newChecked

      })
      // console.log('333333333333')

    }
  },

  /**
   * 组件的方法列表
   */
  methods: {
    updataChecked() {
      this.setData({
        isChecked: !this.data.isChecked,
        // lable: '在组件中也可以修改 properties中的数据'
        // checked= !this.properties.checked  // 不建议修改properties中的数据
      })
      console.log(this.data.lable) // 跟下面效果一样
      // console.log(this.properties.lable)


      //目前复选框组件的状态是存储在复选框组件内部的、存储在自定义组件内部的,
      //但是在以后实际开发中，组件使用者、父组件有时候也需要获取到复选框内部的状态，
      //这时候，自定义组件内部就需要发射一个自定义事件，如果组件使用者、父组件需要使用数据，绑定自定义事件进行获取即可
      this.triggerEvent('shishichecked', this.data.isChecked)
    }

  }

  // pagelife
})